<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta
      content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
      name="viewport"
    />
    <style>
      .main {
        width: 100%;
        text-align: center;
      }
    </style>
  </head>

  <body class="hold-transition login-page">
    <!-- <embed id="error" src='/public/error.mp3' hidden='true'   > -->
    <button onclick="handleClick()">测试</button>
    <div class="main">
      <h3 id="code">未开始扫描</h3>
      <h3>扫描时间：<span id="time"></span></h3>
      <h3>扫描结果：<span id="msg"></span></h3>
    </div>
    <script>
      Date.prototype.format = function(fmt) {
        //author: meizz
        var o = {
          "M+": this.getMonth() + 1, //月份
          "d+": this.getDate(), //日
          "h+": this.getHours(), //小时
          "m+": this.getMinutes(), //分
          "s+": this.getSeconds(), //秒
          "q+": Math.floor((this.getMonth() + 3) / 3), //季度
          S: this.getMilliseconds() //毫秒
        };
        if (/(y+)/.test(fmt))
          fmt = fmt.replace(
            RegExp.$1,
            (this.getFullYear() + "").substr(4 - RegExp.$1.length)
          );
        for (var k in o)
          if (new RegExp("(" + k + ")").test(fmt))
            fmt = fmt.replace(
              RegExp.$1,
              RegExp.$1.length == 1
                ? o[k]
                : ("00" + o[k]).substr(("" + o[k]).length)
            );
        return fmt;
      };
      function handleClick() {
        //  var error = document.getElementById('error');
        var error = document.createElement("EMBED");
        error.src = "/public/error.mp3";
        error.hidden = true;
        error.width = 0;
        error.height = 0;
        console.log(error);
        document.body.appendChild(error);
        setTimeout(() => {
          document.body.removeChild(error);
        }, 3000);
        //  error.play();
      }
      window.onload = function(e) {
        var code = "";
        var lastTime, nextTime;
        var lastCode, nextCode;

        document.onkeypress = function(e) {
          nextCode = e.which;
          nextTime = new Date().getTime();

          if (
            lastCode != null &&
            lastTime != null &&
            nextTime - lastTime <= 30
          ) {
            code += String.fromCharCode(lastCode);
          } else if (
            lastCode != null &&
            lastTime != null &&
            nextTime - lastTime > 100
          ) {
            code = "";
          }
          lastCode = nextCode;
          lastTime = nextTime;
        };
        this.onkeypress = function(e) {
          if (e.which == 13) {
            $("#code").text(code);
            $("#time").text(new Date().format("yyyy-MM-dd hh:mm:ss"));
            $.getJSON("/getBarCode?code=" + code, function(data) {
              console.log(data);
              $("#msg").text("新的二维码！！");
              var ok = document.createElement("EMBED");
              ok.src = "/public/ok.mp3";
              ok.hidden = true;
              ok.width = 0;
              ok.height = 0;
              // console.log(ok);
              document.body.appendChild(ok);
              setTimeout(() => {
                document.body.removeChild(ok);
              }, 2000);
            }).error(function(xhr, textStatus, errorThrown) {
              if (xhr.status === 422) {
                $("#msg").text("条形码重复！！！");
              }
              var error = document.createElement("EMBED");
              error.src = "/public/error.mp3";
              error.hidden = true;
              error.width = 0;
              error.height = 0;
              document.body.appendChild(error);
              setTimeout(() => {
                document.body.removeChild(error);
              }, 3000);
              // console.log(xhr);
              // console.log(textStatus);
              // console.log(errorThrown);
            });
            console.log(code);
            code = "";
          }
        };
      };
    </script>
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
  </body>
</html>
